<template>
  <el-dialog :close-on-click-modal="false" width="600px" :title="$t('m.pick.shortage')" :visible.sync="popupVisible" :before-close="close">
    <!-- tool start -->
    <el-form align="left" ref="form" :model="formInline" label-width="80px" size="mini">
      <el-row>
        <el-col :span="24">
          <el-form-item label="sku">
            <el-input v-model="formInline.productspeccode" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('m.in.productname')">
            <el-input v-model="formInline.productname" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('m.in.productspec')">
            <el-input v-model="formInline.productspec" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('m.out.quantity')">
            <el-input v-model="formInline.quantity" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('m.pick.inventory')">
            <el-input @input="validateNumber('inventory')" maxlength="20" show-word-limit v-model="formInline.inventory"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item :label="$t('m.pick.shortageqty')">
            <el-input v-model="shortageqty" disabled></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <!-- tool end -->

    <el-row>
      <el-col :span="24">
        <el-button type="primary" size="mini" @click="submit">{{$t('m.confirm')}}</el-button>
        <el-button size="mini" @click="close">{{$t('m.close')}}</el-button>
      </el-col>
    </el-row>
  </el-dialog>
</template>
<script>
export default {
  name:'picktask-shortage-popup',
  props:['popupVisible','detail'],
  data(){
    return {
      formInline:{
        productspeccode:'', // sku
        productname:'', // 产品名称
        productspec:'', // 规格
        quantity:'', // 拣货数量
        inventory:0 // 库存数量
      }
    }
  },
  mounted(){
    Object.assign(this.formInline,this.detail)
  },
  computed:{
    shortageqty(){
      return isNaN(this.formInline.quantity - this.formInline.inventory)?0:this.formInline.quantity - this.formInline.inventory
    }
  },
  methods:{
    validateNumber(key){
      this.$set(this.formInline,key,this.formInline[key].replace(/[^\d]/g,''))
    },
    close(){
      this.$emit('close')
    },
    submit(){
      if(this.shortageqty<=0) return this.callbackMessage('缺货数量不能少于等于0')
      let options = {
        method:'post',
        url:`/pickingtask/outStock`,
        data:{
          quantity:this.formInline.inventory,
          tasknumber:this.detail.tasknumber
        }
      }
      this.$axios(options).then(({message})=>{
        this.callbackMessage(message,'success')
        this.differ()
        this.$emit('close')
        this.$emit('callback')
      })
    },
    // 缺货上报生成差异单
    differ(){
      let options = {
        method:'post',
        url:`/stocktakedifference/createdifference`,
        data:{
          locationcode:this.detail.locationcode,
          productspeccode:this.detail.productspeccode,
          stocktakestorage:this.formInline.inventory,
          sourcecode:this.detail.tasknumber,
          source:3
        }
      }
      this.$axios(options).then(()=>{
      })
    }
  }
}
</script>